﻿<!doctype html>
<html class="noDragging" lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
        <meta name="renderer" content="webkit" />
	    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height">
        <title>CSGO</title>
        <link href="favicon.ico" rel="shortcut icon">
	    <script src="./js/common/axios.min.js"></script>
        <script src="./js/common/vue.js"></script>
        <script src="./js/common/vue-resource.js"></script>
        <link rel="stylesheet" href="css/common/swiper.css">
        <link rel="stylesheet" href="css/common/base.css">
        <link rel="stylesheet" href="css/common/media.css">
        <link rel="stylesheet" href="css/index.css">
        <style type="text/css">
            [v-cloak]{
              display: none;
            }
        </style>
    </head>
    <body>

        <div id="contn">
           <div class="tp flex" @click="capture">
                <div class="item" v-for="(item,i) in ttl">
                    <div class="t hvc">
                        <p>{{item.name}}</p>
                        <p>{{item.num.toFixed(2)}}</p>
                    </div>
                </div>
           </div>
           <main>
                <div :class="['filter',show?'active':'']">
                    <img src="img/filter.png" @click="hdlShow">
                    <div class="opt">
                        <p :class="i == optInd?'active':''" v-for="(item,i) in opt" @click="filter(i)">{{item}}</p>
                    </div>
                </div>
                <div class="list flex">
                    <div :class="['item','id' + item.id,item.repeate?'have':'']" v-for="(item,i) in list">
                        <div class="mid">
                            <img class="hvcContn" :src='item.url1'>
                            <p class="id">{{item.id}}</p>
                            <div class="dateSpeed flex">{{item.boughtDate}} <p class="speed">{{item.speed}}</p></div>
                        </div>
                        <p class="name">{{item.name}}</p>
                        <div class="flex price">
                            <p class="bf">{{item.boughtPrice}}</p>
                            <p :class="['compare',!item.up?'down':'']">{{item.gap}}</p>
                        </div>
                        <div class="now price">
                            <p class=''>{{item.price}}</p>
                        </div>
                    </div>
                </div>
           </main>
        </div>
               
        <script src="js/common/swiper.js"></script>
        <script src="js/common/jquery.js"></script>
        <script src="js/common/dataUrl.js"></script>
        <script src="./js/index.js"></script>
        <script src="js/html2canvas.js"></script>
        <script>
            
            var getProInt = null;
            var contn = new Vue({
                el:'#contn',
                data:{
                    ttl:[
                        {name:'购入价',num:0},
                        {name:'当前价',num:0},
                    ],
                    uuToken:'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJjYzVlN2Y3NWQyZTU0NTg5YjQ0OGVmYzYwOThmMTBjMiIsIm5hbWVpZCI6IjE1MDcwMTkiLCJJZCI6IjE1MDcwMTkiLCJ1bmlxdWVfbmFtZSI6IndlYXNua2lpIiwiTmFtZSI6IndlYXNua2lpIiwibmJmIjoxNzA5OTc1MDE4LCJleHAiOjE3MTA4MzkwMTgsImlzcyI6InlvdXBpbjg5OC5jb20iLCJhdWQiOiJ1c2VyIn0.AdNBHrgdUibkZJgfdIoYudFHQkqvveS69PDbq9l7Gqc',
                    uuUserId:'1507019',
                    showInp:false,
                    proNums:0,
                    page:0,
                    finish:false,
                    relax:false,
                    relaxCount:0,
                    hasPosted:0,
                    opt:['↓ 涨价','↑ 涨价','↓ 涨速','↑ 涨速',],
                    optInd:0,
                    list:[
                        {id:48498,url:'',name:'',price:'',up:true,gap:0,boughtPrice:3062,ml:false,speed:'',boughtDate:'2022-11-16',repeate:true},
                        {id:48498,url:'',name:'',price:'',up:true,gap:0,boughtPrice:3500,ml:false,speed:'',boughtDate:'2023-11-24',repeate:false},
                        {id:48498,url:'',name:'',price:'',up:true,gap:0,boughtPrice:4930,ml:false,speed:'',boughtDate:'2024-04-09',repeate:false},
                        {id:62269,url:'',name:'',price:'',up:true,gap:0,boughtPrice:13666,ml:true,mlLvl:1,speed:'',boughtDate:'2023-09-29'},
                        {id:100529,url:'',name:'',price:'',up:true,gap:0,boughtPrice:14000,ml:true,mlLvl:1,speed:'',boughtDate:'2023-09-29'},
                        {id:48059,url:'',name:'',price:'',up:true,gap:0,boughtPrice:6100,ml:false,speed:'',boughtDate:'2023-10-25'},
                        {id:5000,url:'',name:'',price:'',up:true,gap:0,boughtPrice:11200,ml:false,speed:'',boughtDate:'2024-03-20',repeate:true},
                        // {id:62035,url:'',name:'',price:'',up:true,gap:0,boughtPrice:9260,ml:false,speed:'',boughtDate:'2024-04-16',},
                        // {id:5000,url:'',name:'',price:'',up:true,gap:0,boughtPrice:12600,ml:false,speed:'',boughtDate:'2024-03-20',repeate:false},
                    ],
                    rangeAry:[
                        {max:0.18,min:0.15},
                        {max:0.21,min:0.18},
                        {max:0.08,min:0.07},
                    ],
                    show:false,
                    prevent:false
                },
                methods:{
                       
                },
                created(){
                    var This = this;
                    getProInt = setInterval(function(){
                        if(This.relax){
                            This.relaxCount++;
                            This.relaxCount == 5 && (This.relax = false,This.relaxCount = 0);
                            return false;
                        }
                        // for(var n = This.page * 10;n < (This.page + 1) * 10;n++){
                        //     //This.list.length
                        //     This.getPro(This.list[n].id);
                        // }
                        
                            This.getPro(This.list[This.hasPosted].id,This.list[This.hasPosted].ml,This.list[This.hasPosted].mlLvl);
                            This.hasPosted++;
                            if(This.hasPosted % 4 == 0){
                                This.relax = true;
                            }
                            if(This.hasPosted >= This.list.length){
                                clearInterval(getProInt);
                                getProInt = null;
                                console.log(This.list);
                                
                                
                                setTimeout(function(){
                                    var repeateAry = getMatchedItm(This.list,true,'repeate');
                                    var oriList = newObj(This.list);
                                    for(var r = 0;r < oriList.length;r++){
                                        if(oriList[r].repeate == false){
                                            var MatchedItem = getSpecifyItem(repeateAry,oriList[r].id,'id')
                                            console.log(MatchedItem);
                                            oriList[r].price = MatchedItem.price;
                                            oriList[r].name = MatchedItem.name;
                                            oriList[r].gap = (MatchedItem.price - oriList[r].boughtPrice).toFixed(2);
                                            console.log(MatchedItem.price , oriList[r].boughtPrice);
                                            oriList[r].speed = (oriList[r].gap / parseInt((new Date() - new Date(oriList[r].boughtDate)) / 3600 /24 / 1000)).toFixed(1);
                                            oriList[r].up = oriList[r].gap > 0?true:false;
                                            oriList[r].url1 = MatchedItem.url1;
                                        }
                                     
                                    }
                                    console.log(oriList);
                                    // $('img')[1].setAttribute('src',repeateAry[0].url1);
                                    This.list = oriList;
                                    This.filter(This.optInd);
                                    var ttl = [
                                        {name:'购入价',num:0},
                                        {name:'当前价',num:0},
                                    ];
                                    for(var t = 0;t < oriList.length;t++){
                                        ttl[1].num += Number(oriList[t].price);
                                        ttl[0].num += Number(oriList[t].boughtPrice);
                                    }
                                    (ttl[0].num).toFixed(2);
                                    (ttl[1].num).toFixed(2);
                                    This.ttl = ttl;
                                },1000)
                                
                            }
                        
                        
                    },200)
                    //This.getPro1();
                },
                mounted:function(){
                    ifMounted = true;
                },
                methods:{
                    hdlShow(){
                        this.show = !this.show;
                    },
                    filter(ind){
                        this.optInd = ind;
                        if(ind == 0){
                            this.list.sort(this.compare('gap'));
                        }else if(ind == 1){
                            this.list.sort(this.compare('gap',1));
                        }else if(ind == 2){
                            this.list.sort(this.compare('speed'));
                        }else if(ind == 3){
                            this.list.sort(this.compare('speed',1));
                        }
                    },
                    getMatchedIndex(thing,val,keyName,){
                        if(typeof(thing) == 'object'){
                            for(var n = 0;n < thing.length;n++){
                                if(thing[n][keyName] == val){
                                    return n;
                                }
                            }
                        }else{
                            return (thing.indexOf(val));
                        }
                    },
                    ifCanLogin(){
                        console.log(1);
                        axios.get('https://api.youpin898.com/api/user/Account/GetUserInfo',{
                            headers:{
                                Authorization: uuToken
                            }
                        }).then((res) => {
                            //console.log(res);
                        })
                    },
                    getPro(id,ifMl,mlLvl){
                        if(this.prevent) return false;
                        var This = this;
                        var obj = {
                            templateId:id,
                            pageSize:1,
                            pageIndex:1,
                            sortType:1,
                            listSortType:1,
                            userId:this.uuUserId,
                        }
                        if(ifMl){
                            obj.maxAbrade = this.rangeAry[mlLvl - 1].max;
                            obj.minAbrade = this.rangeAry[mlLvl - 1].min;
                        }
                        if(getSpecifyVal(this.list,id,'id','keyWords')){
                            obj.keyWords = getSpecifyVal(this.list,id,'id','keyWords');
                        }
                        axios.post('https://api.youpin898.com/api/homepage/v2/es/commodity/GetCsGoPagedList',obj,{
                            headers:{
                                Authorization: uuToken,
                            }
                        }).then((res) => {
                            if(res.data.code) this.prevent = true;
                            console.log(res.data.Data.CommodityList[0].TemplateId,res.data.Data.CommodityList[0].CommodityName);
                            this.proNums++;
                            var data = res.data.Data.CommodityList[0];
                            var list = newObj(this.list);
                            var ind = this.getMatchedIndex(list,data.TemplateId,'id');
                            list[ind].url = data.IconUrl;
                            main(data.IconUrl, function(base64){
                                var list = JSON.parse(JSON.stringify(This.list));
                                list[ind].url1 = base64;
                                This.list = list;
                            });
                            list[ind].name = data.CommodityName;
                            list[ind].price = Number(data.Price);
                            list[ind].gap = (data.Price - list[ind].boughtPrice).toFixed(2);
                            list[ind].speed = (list[ind].gap / parseInt((new Date() - new Date(list[ind].boughtDate)) / 3600 /24 / 1000)).toFixed(1);
                            list[ind].up = list[ind].gap > 0?true:false;
                            var ttl = this.ttl;
                            ttl[1].num += Number(data.Price);
                            ttl[0].num += Number(list[ind].boughtPrice);
                            (ttl[0].num).toFixed(2);
                            (ttl[1].num).toFixed(2);
                            this.ttl = ttl;
                            this.list = list;
                            
                        })
                    },
                    getPro1(){
                        var obj = {
                            templateId:'52763',
                            pageSize:1,
                            pageIndex:1,
                            sortType:1,
                            listSortType:1,
                            userId:this.uuUserId,
                        }
                        axios.post('https://api.youpin898.com/api/homepage/v2/es/commodity/GetCsGoPagedList',obj,{
                            headers:{
                                Authorization: uuToken,
                            }
                        }).then((res) => {
                            console.log(res);

                            //res.data.data.CommodityList[0]
                        })
                    },
                    compare (property,ifUp) {
                        return function (a, b) {
                            var value1 = a[property];
                            var value2 = b[property];
                            if(ifUp){
                                return value1 - value2;
                            }else{
                                return value2 - value1;
                            }
                            
                        }
                    },
                    capture(){
                        console.log(this.list);
                        // this.list.forEach(function(item,i){
                        //     $('.list .item .mid img').eq(i).attr('src',item.url1);
                        // })
                        renderPdf();
                    }
                }
            })
            
        </script>   
        <script src="js/index.js"></script>
    </body>
</html>